<template>
  <div id="bind_bank">
    <c-title :hide="false" text="验证手机号"></c-title>
    <div class="remove-bank">
      <h3>输入验证码</h3>
      <h5>绑定银行卡需要短信确认,已向手机{{ payer_phone.substr(0, 3) + '****' + payer_phone.substr(7) }}发送短信</h5>
      <div class="bank-input">
        <div class="input-box">
          <input type="text" v-model.trim="sms_code" placeholder="请输入验证码" style="margin-left: 0;" />
          <span class="get-code" @click="verificationCode" v-show="!btnTag">{{btnText}}</span>
          <span class="get-code" v-show="btnTag">{{btnText}}</span>
        </div>
      </div>
      <div class="remove-btn">
        <van-button type="primary" style="width:100%;border-radius: 30px;" color="var(--themeBaseColor)" @click="confirm" >确认</van-button>
      </div>
    </div>
  </div>
</template>
<script>
import bind_bank_controller from './bind_bank_controller';
export default bind_bank_controller;
</script>
<style lang="scss" rel="stylesheet/scss" scoped>
#bind_bank {
  height: 100vh;
  background-color: #fff;
  .remove-bank {
    padding:2.75rem 1.375rem 0 1.375rem;
    text-align: left;
    h3 {
      font-weight: bold;
      font-size: 1.5rem;
      color: #00001C;
      line-height: 1.5rem;
      padding:0 0 0.8125rem 0;
    }
    h5 {
      font-weight: 400;
      font-size: 0.8125rem;
      color: #AAAAB3;
    }
    .bank-input {
      padding: 3rem 0 0 0;
      .input-box {
        position: relative;
        &:last-child {
          margin:0.625rem 0 0 0;
        }
        input {
          width: 100%;
          padding:0 0 0 0.75rem;
          box-sizing: border-box;
          height: 2.75rem;
          outline: none;
          border-radius: 0.625rem 0.625rem 0.625rem 0.625rem;
          border: 0.0625rem solid #D6D6DC;
        }
        img {
          position: absolute;
          right:0.625rem;
          top:0.25rem;
          font-weight: 400;
        }
        .get-code {
          position: absolute;
          right:0.625rem;
          top:0.9375rem;
          font-weight: 400;
          font-size: 0.875rem;
          color: var(--themeBaseColor);
          line-height: 0.875rem;
        }
      }
      
    }
    .remove-btn {
      margin:1.5625rem 0 0 0;
    }
  }
}
</style>
